<template>
	<view class="">
		<view class="navbar">
			<zbar></zbar>
			<view class="navbarcontent">
				<view class="nav_left">
					<image class="img1" src="/static/dw.png" mode=""></image>
					<view class="lefttext">
						{{address}}
					</view>
					<image class="img2" src="/static/sj.png" mode=""></image>
					<view class="abssj">
						<view class="abssjs">
							<view class="">
								
							</view>
						</view>
					</view>
				</view>
				<view class="nav_content" @click="pageSerch">
					<image src="../../static/ss.png" mode=""></image>
					<view class="">搜索</view>
				</view>
			</view>
		
		</view>
	
		<!-- <view class="" @click="as">
			获取定位
		</view> -->
		<scroll-view  class="content" scroll-y="true" :style="{height:`calc(100vh - ${statusBarHeight})`}">
			<view class="swiper">
				<swiper :indicator-dots="true" circular :autoplay="true" :interval="5000" :duration="1000">
					<swiper-item>
						<view class="swiper-item" @click="pagelingjuan">
							<image src="/static/Group_3716@2x.png" mode=""></image>
						</view>
					</swiper-item>
					<swiper-item class="swiper-item">
						<image src="/static/Group_3716@2x.png" mode=""></image>
					</swiper-item>
				</swiper>
			</view>
			<scroll-view class="flexs" scroll-x enable-flex>
				<view class="x_item" v-for="item in imglist" @click="pagefj">
					<image :src="item.url" mode=""></image>
					<view class="text">{{item.text}}</view>
				</view>
			</scroll-view>
			<view class="newshop">
				<view class="new_tit">
					<view class="new_l">
						<image src="/static/icon/n.png" mode=""></image>
						<view class="t1">新上线 </view>
						<view class="t2">新店上线，优惠多多，快来抢购吧~</view>
					</view>
					<image @click="pageNewshop" class="imgr" src="/static/icon/r.png" mode=""></image>
				</view>

				<scroll-view class="priceflexs" scroll-x enable-flex>
					<view class="price_item" v-for="item in 4" @click="pageDetail">
						<view class="img">
							<image src="/static/image@2x (2).png" mode="aspectFill"></image>
							<view class="tip">剩5份+</view>
							<!-- <view class="tip">仅剩1份</view> -->
							<view class="time">
								<image src="../../static/icon/z.png" mode=""></image>
								今天20:00-21:00
							</view>
						</view>
						<view class="text">仟吉cupcake仟吉仟吉</view>
						<view class="DINB">
							<span class="ic">￥</span> 15.9 <span class="FINE">￥35-40</span>
						</view>
						<view class="block_flex">
							<view class="block_l">
								<span class="t1">5.0</span>
								<image src="/static/icon/x.png" mode=""></image>
								<span class="t2">(99+)</span>
							</view>
							<view class="block_r">
								<image src="../../static/icon/dw.png" mode=""></image>
								<span>206m</span>
							</view>
						</view>
					</view>
					<view class="ts" @click="pageNewshop">
						查看更多
						<uni-icons style="margin-top: 10rpx;" color="#000000" size='16' type="right"></uni-icons>
					</view>
				</scroll-view>
			</view>
			<view class="tj_shop">
				<view class="title">
					<image src="../../static/icon/d.png" mode=""></image>
					<view class="">
						伊可库推荐商家
					</view>
				</view>
				<!-- 三种情况 一个商品 二个商品 多个商品 -->
				<view class="shop" v-for="item in shoplist" @click="pageShop">
					<view class="shoptit">
						<view class="">香雪儿</view>
						<view class="x"></view>
						<view class="block_flex">
							<view class="block_l">
								<span class="t1">5.0</span>
								<image src="/static/icon/x.png" mode=""></image>
								<span class="t2">(99+)</span>
							</view>
							<view class="block_r">
								<image src="../../static/icon/dw.png" mode=""></image>
								<span>206m</span>
							</view>
						</view>
					</view>
					<view class="shopflex">
						<view class="price_item" v-for="its in item.shop.slice(0,islength)" @click="pageDetail">
							<view class="img">
								<image src="/static/image@2x (2).png" mode="aspectFill"></image>
								<!-- <view class="tip">仅剩1份</view> -->
								<view class="" v-if="!its.isk && !its.isj">
									<view class="tip">剩5份+</view>
									<view class="time">
										<image src="../../static/icon/z.png" mode=""></image>
										今天20:00-21:00
									</view>
								</view>

								<view class="time1" v-if="its.isk || its.isj">
									<view class="tflex1" v-if="its.isk">
										<image src="../../static/icon/k.png" mode=""></image>
										<view class="">
											已售罄
										</view>
									</view>
									<view class="tflex1" v-if="its.isj">
										<image src="../../static/icon/x1.png" mode=""></image>
										<view class="">
											未上架
										</view>
									</view>
									<view class="tflex">
										<image src="../../static/icon/z.png" mode=""></image>
										今天20:00-21:00
									</view>
								</view>
							</view>
							<view class="text">仟吉cupcake仟吉仟吉仟吉仟吉</view>
							<view class="DINB">
								<span class="ic">￥</span> 15.9 <span class="FINE">￥35-40</span>
							</view>
							<view class="tipflex">
								<view class="its">现烤面包</view>
								<view class="its">面包/甜点</view>
							</view>
							<view class="plun">
								<image src="../../static/icon/w.png" mode=""></image>
								<view class="tts">
									面包很新鲜面包很新鲜，他家的蛋挞...
								</view>
							</view>
						</view>
						<view class="leg1rig" v-if="item.shop.length == 1">
							<image src="../../static/bcg.png" mode=""></image>
							<view class="tflex">
								进店查看
								<uni-icons color='#A37D73' type="right"></uni-icons>
							</view>
						</view>
					</view>
					<view class="check" v-if="item.shop.length > 2" @click.stop="change(item.shop.length)">
						<view class="">
							<span v-if="isopen">查看更多</span>
							<span v-else>收起</span>
							<uni-icons size='16' color="#979797" :type="isopen?'down':'top'"></uni-icons>
						</view>
					</view>
				</view>
			</view>
			<view class="" style="height: 160rpx;"></view>
		</scroll-view>
		<view class="pop" v-if="isshow">
			<view class="popflex" @click="openDaiqucan">
				<image src="../../static/b.png" mode=""></image>
				<view class="texts">
					<view class="" style="width: 46rpx;"></view>
					<view class="">
						<view class="t1">
							有 <span>1</span> 个待取餐
						</view>
						<view class="t2">
							<span>今天23:00</span>前
						</view>
					</view>
				</view>
			</view>
		</view>
		<uni-popup :safe-area='false' ref="popup" type="bottom">
			<view class="popup">
				<image class="imgabs" src="../../static/b.png" mode=""></image>
				<view class="title">
					您有2个待取餐
				</view>
				<view class="swiper">
					<swiper>
						<swiper-item>
							<view class="swiper-item">
								<view class="imgpre">
									<image src="../../static/icon/ju.png" mode=""></image>
									<view class="textpoa">
										<view class="t1">
											取餐码
										</view>
										<view class="t2">
											4512
										</view>
										<view class="t3">
											请到店使用取餐码取餐
										</view>
									</view>
								</view>
								<view class="iconflex">
									<view class="left">
										<image src="../../static/dp.png" mode=""></image>
										香雪儿-面包盲盒
									</view>
									<view class="right">
										<image src="../../static/icon/dh.png" mode=""></image>
										<image src="../../static/icon/sj.png" mode=""></image>
									</view>
								</view>
								<view class="flex1">
									<view class="">
										剩余取餐时间：08:26
									</view>
									<image @click="opents" src="../../static/icon/ts.png" mode=""></image>
								</view>
								<view class="address">
									<view class="">
										取餐地址：伊河路34号院南门东120米
									</view>
									<view class="" style="color: #29A85C;">
										距离您2.5km
									</view>
								</view>
							</view>
						</swiper-item>
					</swiper>

					<view class="btnflex">
						<view class="btn b1" @click="close(1)">
							关闭
						</view>
						<view class="btn b2" @click="openQueren">
							确认取餐
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
		<clearts ref="popupts"></clearts>
		<uni-popup ref="popupyes" type="center">
			<view class="popupyes">
				<view class="images">
					<image src="../../static/popup.png" mode=""></image>
					<view class="imageabs">
						<image src="../../static/orderi1.png" mode=""></image>
						<view class="t1">
							期待您的下次光临~
						</view>
						<view class="ts">
							<view class="we">
								成功减碳 <span>15</span> g，已保护地球<span>15</span>天
							</view>
							<view class="t"></view>
						</view>
						<view class="btn" @click="close(2)">
							我知道了
						</view>
					</view>

				</view>
				<view class="close" @click="close(2)">
					<uni-icons size="40" color="#fff" type="close"></uni-icons>
				</view>
			</view>
		</uni-popup>
		<uv-tabbar :value="0" class="tab"></uv-tabbar>
	</view>
</template>

<script>
	import QQMapwx from '@/minxins/amap-wx.130.js'
	export default {
		data() {
			return {
				isshow: true,
				isopen: true,
				islength: 2,
				shoplist: [{
					shop: [{}]
				}, {
					shop: [{}, {
						isk: true
					}]
				}, {
					shop: [{}, {
						isj: true
					}, {
						isk: true
					}]
				}],
				// #ifdef MP-WEIXIN
				statusBarHeight: uni.getWindowInfo().statusBarHeight + 44 + 'px',
				// #endif
				// #ifndef MP-WEIXIN
				statusBarHeight: uni.getSystemInfoSync().statusBarHeight + 44 + 'px',
				// #endif
				imglist: [{
						text: '烘焙',
						url: require('@/static/indexf/2.png')
					}, {
						text: '轻食',
						url: require('@/static/indexf/3.png')
					},
					{
						text: '卤味',
						url: require('@/static/indexf/4.png')
					},
					{
						text: '果蔬',
						url: require('@/static/indexf/5.png')
					},
					{
						text: '饮品',
						url: require('@/static/indexf/6.png')
					},
					{
						text: '小吃',
						url: require('@/static/indexf/7.png')
					},
					{
						text: '鲜花',
						url: require('@/static/indexf/8.png')
					}
				],
				popup: {

				},
				address: ''
			}
		},
		onLoad() {
			// setTimeout(() => {
			// 	this.isshow = true
			// }, 2000)
			// this.$refs.popup.open()
			// this.$refs.popupyes.open()
			this.initialfun()
		},
		methods: {
			pagelingjuan() {
				uni.navigateTo({
					url: '/mainpage/collectcoupons'
				})
			},
			initialfun() {
				let that = this
				that.address = '定位中...'
				uni.getSetting({
				    success: (res) => {
				        if (!res.authSetting['scope.userLocation']) {
				            // 未授权，进行授权请求
							console.log('12333');
				        } else {
							console.log('222');
				            // 已授权，直接获取位置信息
							this.getlocat()
							
				        }
				    }
				})
				
			},
			as(){
				uni.openSetting({
					success: (response) => {
						if (response.authSetting['scope.userLocation']) {
							console.log('重新授权获取位置信息-同意');
							// 重新获取定位
							this.getlocat()
						} else {
							console.log('重新授权获取位置信息-未同意');
						}
					},
					fail: () => {
						console.log('openSetting接口调用失败的回调函数');
					}
				})
			},
			getlocat(){
				let that = this
				uni.getLocation({
					type: 'gcj02', //返回可以用于uni.openLocation的经纬度
					altitude: true,
					success: function(res) {
						
						const qqmapsdk = new QQMapwx.AMapWX({
							key: 'fec30c445693bf6e07f0c753a07d9667'
						})
						qqmapsdk.getRegeo({
							location: '' + res.longitude + ',' + res.latitude + '',
							success: (res) => {
								// number
								that.address = res[0].regeocodeData.addressComponent.streetNumber
									.street + res[0].regeocodeData.addressComponent.streetNumber
									.number
							},
							fail: function(error) {
								console.error(error);
							}
						})
						
						qqmapsdk.getRegeo({
							name:'洛阳市',
							success: (res) => {
								console.log(res,'222222222211111111111');
							},
							fail: function(error) {
								console.error(error);
							}
						})
						// const latitude = res.latitude;
						// const longitude = res.longitude;
						// uni.openLocation({
						// 	latitude: latitude,
						// 	longitude: longitude,
						// 	success: function () {
						// 		console.log('success');
						// 	}
						// });
					},
					fail: (err) => {
						console.log(err);
					}
				});
			},

			pageSerch() {
				uni.navigateTo({
					url: '/mainpage/search'
				})
			},
			pagefj() {
				uni.switchTab({
					url: '/pages/fj/fj'
				})
			},
			pageNewshop() {
				uni.navigateTo({
					url: '/mainpage/newshop'
				})
			},
			pageShop() {
				uni.navigateTo({
					url: '/mainpage/shopdetail'
				})
			},
			pageDetail() {
				uni.navigateTo({
					url: '/mainpage/details'
				})
			},
			//打开待取餐
			openDaiqucan() {
				this.$refs.popup.open()
			},
			//打开确认取餐
			openQueren() {
				this.$refs.popupyes.open()
			},
			opents() {
				this.$refs.popupts.open()
			},
			close(type) {
				if (type == 1) {
					this.$refs.popup.close()
				} else {
					this.$refs.popupyes.close()
				}
			},
			change(e) {
				this.isopen = !this.isopen
				if (this.isopen) {
					this.islength = 2
				} else {
					this.islength = e
				}
			}
		}
	}
</script>

<style lang="scss">
	.abssj{
		position: absolute;
		z-index: 9999;
		top:44px;
		.abssjs{
			width: 372rpx;
			height: 220rpx;
			background: rgba(0,0,0,0.8);
			border-radius:10rpx;
			position: relative;
		}
		.abssjs:after{
			content:"";
			border:12rpx solid  rgba(0,0,0,0.8);
			border-top-color:transparent;
			border-right-color:transparent;
			border-bottom-color: rgba(0,0,0,0.8);
			border-left-color:transparent;
			width:0px;
			height:0px;
			position:absolute;
			top:-24rpx;
			left: 100rpx;
		}
	}

	
	.navbar {
		position: sticky;
		top: 0;
		padding: 0rpx 10px;
		box-sizing: border-box;
		background-color: #fff;
		.navbarcontent {
			position: relative;
			height: 44px;
			display: flex;
			align-items: center;
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			font-size: 28rpx;
			color: #000000;

			.nav_left {
				display: flex;
				height: 44px;
				align-items: center;
				position: relative;
				.img1 {
					width: 52rpx;
					height: 52rpx;
				}

				.lefttext {
					width: 164rpx;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
					margin: 0rpx 16rpx;
				}

				.img2 {
					width: 24rpx;
					height: 18rpx;
				}
			}

			.nav_content {
				width: 200rpx;
				height: 68rpx;
				background: #F9F9F9;
				border-radius: 34rpx;
				margin-left: 20rpx;
				display: flex;
				align-items: center;
				padding: 0rpx 22rpx;
				box-sizing: border-box;

				image {
					width: 48rpx;
					height: 48rpx;
					margin-right: 16rpx;
				}
			}

		}
	}

	.content {
		overflow: auto;

		.swiper {
			width: 100%;
			height: 300rpx;

			.swiper-item {
				image {
					width: 100%;
					height: 300rpx;
				}
			}
		}

		.flexs {
			width: 100%;
			height: 180rpx;
			white-space: nowrap;
			flex-direction: row;
			padding: 20rpx;
			box-sizing: border-box;

			.x_item {
				display: inline-block;
				width: 100rpx;
				text-align: center;
				margin-right: 36rpx;

				image {
					width: 90rpx;
					height: 90rpx;
					transform: rotate(0deg);
				}

				.text {
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 26rpx;
					color: #000000;
				}
			}

			.x_item:active {
				image {
					transform: rotate(20deg);
					background-color: #C5FBC5;
					border-radius: 45rpx;
				}
			}
		}

		.newshop {
			padding: 20rpx 20rpx 0rpx 20rpx;
			box-sizing: border-box;
			border-top: 1px solid #FBFBFB;
			border-bottom: 1px solid #FBFBFB;

			.new_tit {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.new_l {
					display: flex;
					align-items: center;

					image {
						width: 36rpx;
						height: 36rpx;
					}

					.t1 {
						font-family: PingFang SC, PingFang SC;
						font-weight: bold;
						font-size: 36rpx;
						color: #000000;
						margin: 0rpx 8rpx;
					}

					.t2 {
						font-family: PingFang SC, PingFang SC;
						font-weight: 500;
						font-size: 24rpx;
						color: #979797;
						margin-top: 10rpx;
					}
				}

				.imgr {
					width: 40rpx;
					height: 40rpx;
				}
			}

			.priceflexs {
				width: 100%;
				display: flex;
				align-items: center;

				.price_item {
					width: 280rpx;
					margin-right: 20rpx;
					margin-top: 30rpx;

					.img {
						width: 280rpx;
						height: 200rpx;
						position: relative;

						image {
							width: 280rpx;
							height: 200rpx;
							border-radius: 15rpx 15rpx 0rpx 0rpx;
						}

						.tip {
							position: absolute;
							top: 14rpx;
							left: 12rpx;
							height: 32rpx;
							background: #29A85C;
							border-radius: 4rpx 4rpx 4rpx 4rpx;
							font-family: PingFang SC, PingFang SC;
							font-weight: 500;
							font-size: 20rpx;
							color: #FFFFFF;
							padding: 0 10rpx;
							line-height: 32rpx;
						}

						.time {
							position: absolute;
							bottom: 0%;
							width: 100%;
							height: 40rpx;
							background: rgba(0, 0, 0, 0.5);
							display: flex;
							align-items: center;
							justify-content: center;

							image {
								width: 24rpx;
								height: 24rpx;
								margin-right: 6rpx;
							}

							font-family: PingFang SC,
							PingFang SC;
							font-weight: 500;
							font-size: 20rpx;
							color: #FFFFFF;
						}
					}

					.text {
						font-family: PingFang SC, PingFang SC;
						font-weight: bold;
						font-size: 28rpx;
						color: #000000;
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
						margin-top: 16rpx;
					}

					.block_flex {
						display: flex;
						justify-content: space-between;
						align-items: center;

						image {
							width: 28rpx;
							height: 28rpx;
							margin: 0rpx 6rpx;
						}

						.block_l {
							display: flex;
							align-items: center;

							.t1 {
								font-family: 'DINB';
								font-size: 32rpx;
								color: #000000;
							}

							.t2 {
								font-family: 'FINE';
								font-weight: 400;
								font-size: 24rpx;
								color: #979797;
							}

						}

						.block_r {
							font-family: 'FINE';
							font-weight: 400;
							font-size: 24rpx;
							color: #000000;
						}
					}

				}

				.ts {
					width: 50rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 24rpx;
					color: #000000;
					display: flex;
					align-items: center;
					margin-left: 10rpx;
				}
			}


		}

		.tj_shop {
			padding: 20rpx;
			box-sizing: border-box;

			.title {
				display: flex;
				align-items: center;
				margin-bottom: 20rpx;

				image {
					width: 36rpx;
					height: 36rpx;
					margin-right: 6rpx;
				}

				font-family: PingFang SC,
				PingFang SC;
				font-weight: bold;
				font-size: 36rpx;
				color: #000000;
			}

			.shop {
				width: 710rpx;
				padding: 22rpx 10rpx 0rpx;
				box-sizing: border-box;
				background: linear-gradient(180deg, #FFF7EB 0%, #FFFFFF 41%);
				border-radius: 20rpx 20rpx 20rpx 20rpx;
				border: 1rpx solid #FFF7ED;
				margin-bottom: 20rpx;

				.shoptit {
					display: flex;
					font-family: PingFang SC, PingFang SC;
					font-weight: bold;
					font-size: 32rpx;
					color: #000000;
					align-items: center;

					.x {
						width: 3rpx;
						height: 35rpx;
						background-color: #000000;
						margin: 0rpx 10rpx;
					}

					.block_flex {
						flex: 1;
						display: flex;
						justify-content: space-between;
						align-items: center;

						image {
							width: 28rpx;
							height: 28rpx;
							margin: 0rpx 6rpx;
						}

						.block_l {
							display: flex;
							align-items: center;

							.t1 {
								font-family: 'DINB';
								font-size: 32rpx;
								color: #000000;
							}

							.t2 {
								font-family: 'FINE';
								font-weight: 400;
								font-size: 24rpx;
								color: #979797;
							}

						}

						.block_r {
							font-family: 'FINE';
							font-weight: 400;
							font-size: 24rpx;
							color: #000000;
						}
					}
				}

				.shopflex {
					display: flex;
					flex-wrap: wrap;
					justify-content: space-between;
					margin-top: 20rpx;
				}

				.price_item {
					width: 340rpx;
					margin-bottom: 26rpx;

					.img {
						width: 340rpx;
						height: 200rpx;
						position: relative;

						image {
							width: 340rpx;
							height: 200rpx;
							border-radius: 15rpx;
						}

						.tip {
							position: absolute;
							top: 14rpx;
							left: 12rpx;
							height: 32rpx;
							background: #29A85C;
							border-radius: 4rpx 4rpx 4rpx 4rpx;
							font-family: PingFang SC, PingFang SC;
							font-weight: 500;
							font-size: 20rpx;
							color: #FFFFFF;
							padding: 0 10rpx;
							line-height: 32rpx;
						}

						.time {
							position: absolute;
							bottom: 0%;
							width: 100%;
							height: 40rpx;
							background: rgba(0, 0, 0, 0.5);
							display: flex;
							align-items: center;
							justify-content: center;

							image {
								width: 24rpx;
								height: 24rpx;
								margin-right: 6rpx;
							}

							font-family: PingFang SC,
							PingFang SC;
							font-weight: 500;
							font-size: 20rpx;
							color: #FFFFFF;
							border-radius: 0rpx 0rpx 15rpx 15rpx;
						}

						.time1 {
							position: absolute;
							top: 0%;
							width: 100%;
							height: 200rpx;
							background: rgba(0, 0, 0, 0.5);
							border-radius: 15rpx;
							display: flex;
							justify-content: center;

							.tflex {
								width: 100%;
								position: absolute;
								bottom: 6rpx;
								display: flex;
								align-items: center;
								justify-content: center;
								font-family: PingFang SC,
									PingFang SC;
								font-weight: 500;
								font-size: 20rpx;
								color: #FFFFFF;

								image {
									width: 24rpx;
									height: 24rpx;
									margin-right: 6rpx;
								}
							}

							.tflex1 {
								display: flex;
								align-items: center;
								font-family: PingFang SC, PingFang SC;
								font-weight: 500;
								font-size: 30rpx;
								color: #FFFFFF;

								image {
									width: 44rpx;
									height: 44rpx;
									margin-right: 6rpx;
								}
							}

						}
					}

					.text {
						font-family: PingFang SC, PingFang SC;
						font-weight: bold;
						font-size: 30rpx;
						color: #000000;
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
						margin-top: 10rpx;
					}

					.tipflex {
						display: flex;
						align-items: center;

						.its {
							height: 44rpx;
							background: #F6F6F6;
							border-radius: 8rpx;
							font-family: PingFang SC, PingFang SC;
							font-weight: 500;
							font-size: 24rpx;
							color: #7B7B7B;
							line-height: 44rpx;
							padding: 0rpx 16rpx;
							margin: 10rpx 8rpx 0rpx 0rpx;
						}
					}

					.plun {
						display: flex;
						margin-top: 15rpx;

						image {
							width: 30rpx;
							height: 30rpx;
							margin-right: 6rpx;
						}

						.tts {
							font-family: PingFang SC, PingFang SC;
							font-weight: 500;
							font-size: 24rpx;
							color: #979797;
							white-space: nowrap;
							overflow: hidden;
							text-overflow: ellipsis;
						}
					}
				}
			}

			.check {
				text-align: center;
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				font-size: 24rpx;
				color: #979797;
				line-height: 30rpx;
				margin-bottom: 20rpx;
			}

			.leg1rig {
				position: relative;

				image {
					width: 340rpx;
					height: 400rpx;
				}

				.tflex {
					position: absolute;
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 28rpx;
					color: #A37D73;
					display: flex;
					align-items: center;
					top: 112rpx;
					left: 98rpx;
				}
			}
		}

		// .sc {
		// 	width: 200rpx;
		// 	height: 200rpx;
		// 	text-align: center;
		// 	margin: 100rpx;
		// 	position: relative;
		// 	background: #413224;
		// }

		// .sc::before {
		// 	content: '';
		// 	position: absolute;
		// 	width: 18px;
		// 	height: 18px;
		// 	transform: rotate(45deg);
		// 	background: #413224;
		// 	border-radius: 6rpx 0rpx 0rpx 0rpx;
		// 	top: -9px;
		// }


	}



	/* #ifdef MP-WEIXIN */
	// 默认指示点样式
	wx-swiper .wx-swiper-dot {
		position: relative;
		background-color: #F9F9F9;
		width: 10rpx;
		border-radius: 5rpx;
		height: 8rpx;
	}

	// 当前选中样式
	wx-swiper .wx-swiper-dot-active {
		background-color: #ffffff !important;
		width: 40rpx;
		border-radius: 10rpx;
	}

	/* #endif */
	.pop {
		position: fixed;
		right: 10rpx;
		bottom: 300rpx;

		.popflex {
			display: flex;
			width: 290rpx;
			position: relative;
		}

		image {
			width: 118rpx;
			height: 114rpx;
			position: relative;
			z-index: 1;
		}

		.texts {
			position: absolute;
			width: 216rpx;
			height: 82rpx;
			background: #29A85C;
			border-radius: 8rpx 8rpx 8rpx 8rpx;
			border: 2rpx solid #000000;
			right: 0%;
			bottom: 0%;
			padding: 0rpx 12rpx 0rpx 0rpx;
			box-sizing: border-box;
			display: flex;
			align-items: center;

			.t1 {
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				font-size: 24rpx;
				color: #FFFFFF;

				span {
					font-family: 'DINB';
					font-size: 30rpx;
					color: #000;
				}
			}

			.t2 {
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				font-size: 24rpx;
				color: #FFFFFF;

				span {
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 24rpx;
					color: #FFFFFF;
					height: 32rpx;
					background: #000000;
					border-radius: 8rpx;
					margin-right: 4rpx;
					padding: 0rpx 6rpx;
				}
			}
		}
	}

	.popup {
		width: 100%;
		height: 839rpx;
		background-color: #FFFFFF;
		padding: 38rpx 40rpx;
		box-sizing: border-box;

		.imgabs {
			position: absolute;
			width: 140rpx;
			height: 146rpx;
			top: -80rpx;
			left: 46rpx;
		}

		.title {
			text-align: center;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			font-size: 30rpx;
			color: #000000;
		}

		.swiper {
			swiper {
				height: 580rpx;
			}

			.swiper-item {
				width: 100%;

				.imgpre {
					position: relative;
					margin: 40rpx auto;
					width: 416rpx;
					height: 251rpx;

					image {
						width: 416rpx;
						height: 251rpx;
					}

					.textpoa {
						text-align: center;
						position: absolute;
						width: 416rpx;
						height: 251rpx;
						padding: 24rpx;
						box-sizing: border-box;
						top: 0%;

						.t1 {
							font-family: PingFang SC, PingFang SC;
							font-weight: bold;
							font-size: 28rpx;
							color: #000000;
						}

						.t2 {
							font-family: 'DINB';
							font-size: 80rpx;
							color: #000000;
						}

						.t3 {
							font-family: PingFang SC, PingFang SC;
							font-weight: 500;
							font-size: 28rpx;
							color: #23633D;
							line-height: 33rpx;
							margin-top: 40rpx;
						}
					}
				}

				.iconflex {
					display: flex;
					align-items: center;
					justify-content: space-between;

					image {
						width: 32rpx;
						height: 33rpx;
					}

					.left {
						font-family: PingFang SC, PingFang SC;
						font-weight: bold;
						font-size: 30rpx;
						color: #000000;
						display: flex;
						align-items: center;

						image {
							margin-right: 6rpx;
						}
					}

					.right {
						image {
							margin-left: 30rpx;
						}
					}
				}

				.flex1 {
					display: flex;
					align-items: center;
					width: 670rpx;
					height: 68rpx;
					background: #F3F3F3;
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 24rpx;
					color: #000000;
					justify-content: space-between;
					padding: 0rpx 20rpx;
					box-sizing: border-box;
					margin: 20rpx auto;

					image {
						width: 32rpx;
						height: 33rpx;
					}
				}

				.address {
					width: 670rpx;
					background: #F3F3F3;
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 24rpx;
					color: #000000;
					padding: 15rpx 20rpx;
					box-sizing: border-box;
					margin: 20rpx auto;
				}
			}
		}

		.btnflex {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 30rpx;

			.btn {
				width: 320rpx;
				height: 92rpx;
				background: #F3F3F3;
				border-radius: 8rpx 8rpx 8rpx 8rpx;
				text-align: center;
				line-height: 92rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				font-size: 32rpx;
				color: #000000;
			}

			.b2 {
				background: #000000;
				color: #fff;
			}
		}
	}

	.popupyes {
		width: 692rpx;

		.images {
			width: 692rpx;
			height: 576rpx;
			position: relative;

			image {
				width: 692rpx;
				height: 576rpx;
			}

			.imageabs {
				width: 480rpx;
				height: 450rpx;
				position: absolute;
				top: 80rpx;
				box-sizing: border-box;
				left: 100rpx;
				text-align: center;

				image {
					width: 144rpx;
					height: 96rpx;
					margin: 40rpx auto 10rpx;
				}

				.t1 {
					font-family: PingFang SC, PingFang SC;
					font-weight: 800;
					font-size: 28rpx;
					color: #000000;
				}

				.ts {
					width: 380rpx;
					height: 40rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 24rpx;
					color: #000000;
					margin: 20rpx auto;
					position: relative;

					.we {
						position: absolute;
						z-index: 9;
						left: 20rpx;

						span {
							font-weight: bold;
							font-size: 28rpx;
						}
					}

					.t {
						width: 380rpx;
						height: 12rpx;
						background: #38CDA5;
						border-radius: 6rpx 6rpx 6rpx 6rpx;
						position: absolute;
						bottom: 0rpx;
					}
				}

				.btn {
					width: 280rpx;
					height: 92rpx;
					background: #000000;
					border-radius: 8rpx 8rpx 8rpx 8rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 32rpx;
					color: #FFFFFF;
					line-height: 92rpx;
					margin: 80rpx auto;
				}

			}
		}

		.close {
			text-align: center;
		}
	}
</style>